
const canvas = document.getElementById("canvas1") as HTMLCanvasElement;
const context = canvas.getContext("2d") as CanvasRenderingContext2D;

context.lineWidth = 2;
context.strokeStyle = "red";
context.fillStyle="yellow"
//绘制矩形边框
context.strokeRect(75, 25, 150, 100);

//填充矩形
context.fillRect(85, 35, 250, 200)

// 清除矩形
context.clearRect(85, 35, 50, 20);


// 也有单独拆开的写法

context.rect(100,100,100,100);
context.stroke()
context.fillStyle="black"
context.fill()